import React, {Component} from 'react';

import {Form, Card, Input, Button, message} from 'antd'

class Edit extends Component {

    render() {
        const onFinish = (values) => {
            console.log('Success:', values);
        };
        const priceValidator = (rule,value,callback)=>{
            if (value*1>100){
                callback("价格不能大于100!")
            }else {
                callback()
            }
        };
        const onFinishFailed = (values) => {
            message.error(values + '请输入正确内容!');
        };
        return (
            <Card title="商品编辑">
                <Form onFinish={onFinish}
                      onFinishFailed={onFinishFailed}>
                    <Form.Item label="名字" name="name"
                               rules={[
                                   {
                                       required: true,
                                       message: '请输入商品名称!',
                                   },
                               ]}>
                        <Input placeholder="请输入商品名字"></Input></Form.Item>
                    <Form.Item label="价格" name="price"
                               rules={[
                                   {
                                       required: true,
                                       message: '请输入商品价格!',
                                   },
                                   {validator:priceValidator
                                   }
                               ]}>
                        <Input placeholder="请输入商品价格"></Input></Form.Item>
                    <Button type="primary" htmlType="submit">保存</Button>
                </Form>
            </Card>
        );
    }
}

export default Edit;
